{% include 'header.html' %}
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-header">简单用法</div>
            <div class="layui-form-item">
                <label class="layui-form-label" style="width: 120px;">通知用户</label>
                <div class="layui-input-inline" style="margin-left: 20px; width: 450px;">
                    <input type="text" name="noticUser" autocomplete="on" placeholder="请输入通知用户" class="layui-input">
                    <i class="layui-icon iconSerch"></i>
                </div>
            </div>
            <div class="showChooseDiv" style="display: none;  padding: 20px">
                <div id="dept_main" style="margin-right: 2%;">
                    <div id="dept_tree"></div>
                    <div class="layui-form-item float-right">
                        <div class="layui-input-block">
                            <button class="layui-btn layui-btn-normal layui-btn-sm" id="lay-submit-Choose">确定</button>
                        </div>
                    </div>
                </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  <script>
function get_class() {  //获取节点数据
    var treeData = [];
    layui.$.ajax({
      url:'/servers/get_class',  //接口
      type:'get',     //请求方式
      async:false,  //同步请求
      success: function(result){
        treeData = result.data;
      }
    });
    console.log('节点数据：',treeData);
    return treeData;
  }
      var files;
    var form;
    var layer;
    var $;
      var transfer;
    layui.use(['layer','tree'], function() {
        var $ = layui.jquery;
         layer = layui.layer;
         var tree = layui.tree;
        //树形组件复选框
        var data = get_class();
         tree.render({
      elem: '#dept_tree'
      ,data: data
      ,edit: []
      ,showCheckbox: false  //是否显示复选框
      ,showRadio: true
      ,id: 'treeId'
      ,onlyIconControl: true  //是否仅允许节点左侧图标控制展开收缩
      ,isJump: true //是否允许点击节点时弹出新窗口跳转
      ,click: function(obj){
        var data = obj.data;  //获取当前点击的节点数据
        layer.msg('状态：'+ obj.state + '<br>节点数据：' + JSON.stringify(data));
      }
      ,operate: function(obj){
        var type = obj.type;
        var data = obj.data; //得到当前节点的数据
        var elem = obj.elem; //得到当前节点元素
        console.log('elem:',elem,'data:',data)
      }
    });
           function get_class() {  //获取节点数据
    var treeData = [];
    layui.$.ajax({
      url:'/servers/get_class',  //接口
      type:'get',     //请求方式
      async:false,  //同步请求
      success: function(result){
        treeData = result.data;
      }
    });
    console.log('节点数据：',treeData);
    return treeData;
  }

        //打开选择页
                $("body").on("click", ".iconSerch", function() {
                    debugger;
                    var dataInto=$(this).prev().attr("name");
                    $("#lay-submit-Choose").attr("data-into",dataInto);
                    var dataDicType="";
                    if(dataInto.lastIndexOf('.')==-1){
                        dataDicType=dataInto;
                    }else{
                        dataDicType=dataInto.substr(dataInto.lastIndexOf('.')+1)
                    }

                    layer.open({
                        type: 1,
                        title: "选择",
                        area: ['18%', '50%'],
                        content: $(".showChooseDiv"),
                        maxmin: false,
                        shadeClose: true,
                        shade: false,
                    });
                });
                //选择页确定
                 $("#lay-submit-Choose").on("click", function() {
                     var getData = tree.getChecked('treeId');
                      var item="";
                      for (var i = 0; i < getData.length; i++) {
                          for (var j = 0; j < getData[i].children.length; j++) {
                              item += getData[i].children[j].title +",";
                          }
                      }
                      item=(item.substring(item.length-1)==',')?item.substring(0,item.length-1):item;
                    if (getData.length<1) {
                        layer.alert("请选择一项");
                    }else{
                        var dataInto=$(this).attr("data-into");
                        //$("[name='"+dataInto+"']").val(getData[0].title);
                        getData
                    $("[name='noticUser']").val(item);
                        layer.close(layer.index);
                    }
                    return false;
                });
                //渲染字典项选择
                function renderChoose(dataDicType) {
                    layer.alert("请选择一项");
                };
    });
  </script>
{% include 'footer.html' %}